<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width,user-scalable=no, initial-scale=1.0,
  maximum-scale=1.0, minimum-scale=1.0">
    <link rel="stylesheet" href="css/Normalize.css">
    <link rel="stylesheet" href="css/index.css">
    <script src="js/JavaScript.js"></script>
<!--    引入JS文件！-->
    <title>周边游</title>
</head>
<body>
    <!-- 导航搜索栏-->
    <div class="top">
    <div class="searchBar">
        <form action="">
            <label>
                <input type="text" value="搜索:目的地/酒店/景点/航班号">
            </label>
        </form>
        <a href="#"><div class="magnifier"><img src="images/fdj.png" alt=""></div></a>
    </div>
        <div class="mine">
            <a href="#">            <img src="images/wd.png" alt="">
            </a>
        </div>
    </div>
<!-- 轮番图 advertise 广告-->
<div class="advertise">
    <ul>
        <li><a href="#"><img src="images/gg4.jpg" alt=""></a></li>
        <li><a href="#"><img src="images/gg1.jpg" alt=""></a></li>
        <li><a href="#"><img src="images/gg2.jpg" alt=""></a></li>
        <li><a href="#"><img src="images/gg3.jpg" alt=""></a></li>
        <li><a href="#"><img src="images/gg4.jpg" alt=""></a></li>
        <li><a href="#"><img src="images/gg1.jpg" alt=""></a></li>
        <!--        <li><img src="images/gg2.jpg" alt=""></li>-->
    </ul>
</div>

<!-- 小模块  smallModule-->
<div class="smallModule">
    <ul>
        <li><a href="#"><img src="images/1.png" alt=""> <span>景点·玩乐</span></a></li>
        <li><a href="#"><img src="images/4.png" alt=""> <span>游山·玩水</span></a></li>
        <li><a href="#"><img src="images/3.png" alt=""> <span>海上·乐园</span></a></li>
        <li><a href="#"><img src="images/5.png" alt=""> <span>迪士尼</span></a></li>
        <li><a href="#"><img src="images/2.png" alt=""> <span>旅游·推荐</span></a></li>
    </ul>

</div>

<!-- 副导航栏  Secondary navigation bar-->
    <a href="#">
    <div class="secondaryNavigationBar0">
    <div class="secondaryNavigationBar">
        <div class="left">
            酒店
            <img src="img/jd.png" alt="">
        </div>
        <div class="mid">
            <div>机票</div>
            <div>火车票</div>
        </div>
        <div class="right">
            <div>旅游</div>
            <div>攻略/景点</div>
        </div>
    </div>
    <div class="secondaryNavigationBar">
        <div class="left">
            民宿/客栈
            <img src="img/jd.png" alt="">
        </div>
        <div class="mid">
            <div>机+酒</div>
            <div>汽车+船票</div>
        </div>
        <div class="right">
            <div>门票/活动</div>
            <div>美食</div>
        </div>
    </div>

    <div class="secondaryNavigationBar">
        <div class="left">
            特价/爆款
            <img src="img/jd.png" alt="">
        </div>
        <div class="mid">
            <div>专车/包车</div>
            <div>出租车</div>
        </div>
        <div class="right">
            <div>周边游</div>
            <div>购物/免税</div>
        </div>
    </div>
</div>
    </a>


    <!-- 副模块  submodule-->
<div class="submodule">
    <ul>
        <li><a href="#"><img src="img/q1.png" alt=""><span>充话费</span></a></li>
        <li><a href="#"><img src="img/q2.png" alt=""><span>安全管家</span></a></li>
        <li><a href="#"><img src="img/q3.png" alt=""><span>消费</span></a></li>
        <li><a href="#"><img src="img/q4.png" alt=""><span>旅游</span></a></li>
        <li><a href="#"><img src="img/q5.png" alt=""><span>信用卡</span></a></li>
        <li><a href="#"><img src="img/q6.png" alt=""><span>巴黎7日游</span></a></li>
        <li><a href="#"><img src="img/q7.png" alt=""><span>购物</span></a></li>
        <li><a href="#"><img src="img/q8.png" alt=""><span>背包客</span></a></li>
        <li><a href="#"><img src="img/q9.png" alt=""><span>特惠</span></a></li>
        <li><a href="#"><img src="img/q0.png" alt=""><span>传递爱心</span></a></li>
    </ul>

</div>

<!-- 更多福利  Welfare-->
<div class="Welfare">
    <div class="tp"><img src="img/rm.png" alt=""></div>
    <a href="#"> <div class="right0"> 获取更多福利</div></a>
</div>

    <!-- main 主题商品-->
    <div class="main">
        <div class="commodity">
            <div class="box2"><a href="#"><img src="img/pic1.jpg" alt=""></a></div>
            <div class="box2"><a href="#"><img src="img/pic2.jpg" alt=""></a></div>
        </div>
        <div class="commodity">
            <div class="box2"><a href="#"><img src="img/pic3.jpg" alt=""></a></div>
            <div class="box2"><a href="#"><img src="img/pic4.jpg" alt=""></a></div>
        </div>
        <div class="commodity">
            <div class="box2"><a href="#"><img src="img/pic5.jpg" alt=""></a></div>
            <div class="box2"><a href="#"><img src="img/pic6.jpg" alt=""></a></div>
        </div>
        <div class="commodity">
            <div class="box2"><a href="#"><img src="img/pic3.jpg" alt=""></a></div>
            <div class="box2"><a href="#"><img src="img/pic4.jpg" alt=""></a></div>
        </div>
        <div class="commodity">
            <div class="box2"><a href="#"><img src="img/pic1.jpg" alt=""></a></div>
            <div class="box2"><a href="#"><img src="img/pic2.jpg" alt=""></a></div>
        </div>
        <div class="commodity">
            <div class="box2"><a href="#"><img src="img/pic5.jpg" alt=""></a></div>
            <div class="box2"><a href="#"><img src="img/pic6.jpg" alt=""></a></div>
        </div>


        <div class="commodity">
            <div class="box2"><a href="#"><img src="img/pic1.jpg" alt=""></a></div>
            <div class="box2"><a href="#"><img src="img/pic6.jpg" alt=""></a></div>
        </div>
        <div class="commodity">
            <div class="box2"><a href="#"><img src="img/pic3.jpg" alt=""></a></div>
            <div class="box2"><a href="#"><img src="img/pic4.jpg" alt=""></a></div>
        </div>
        <div class="commodity">
            <div class="box2"><a href="#"><img src="img/pic5.jpg" alt=""></a></div>
            <div class="box2"><a href="#"><img src="img/pic2.jpg" alt=""></a></div>
        </div>
        <div class="commodity">
            <div class="box2"><a href="#"><img src="img/pic4.jpg" alt=""></a></div>
            <div class="box2"><a href="#"><img src="img/pic3.jpg" alt=""></a></div>
        </div>
        <div class="commodity">
            <div class="box2"><a href="#"><img src="img/pic1.jpg" alt=""></a></div>
            <div class="box2"><a href="#"><img src="img/pic2.jpg" alt=""></a></div>
        </div>
        <div class="commodity">
            <div class="box2"><a href="#"><img src="img/pic6.jpg" alt=""></a></div>
            <div class="box2"><a href="#"><img src="img/pic5.jpg" alt=""></a></div>
        </div>
    </div>
    <!-- 返回顶部  Back to top-->
    <div class="backToTop">
        <img src="images/back.png" alt="">

    </div>
</body>
</html>